<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Daatum - home</title>
<style type="text/css">
.style1 {
    font-family: "Kristen ITC";
    font-size: 48px;
    font-weight: bold;
}
.style5 {
    font-size: 28px;
    color: #FF0000;
}
.styleQueryBox {
    border: 3px solid ;
    font-size:medium;
    font-weight:100;
}
.KristenBlue {
    font-family: "Kristen ITC";
    font-size: 24px;
    font-weight: bold;
    color:#0000CC;
}
.style9 {font-size: 56px}
.style11 {
    color: #333333;
    font-size: 18px;
    font-family:'Kristen ITC';
}
.bt {
border-top:1px solid #3366CC;
background:#FFFF none repeat scroll 0%;
color:#54723E;
padding:5px 1px 4px;
}
/* Sortable tables */
table.sortable thead {
    background-color:#eee;
    color:#666666;
    font-weight: bold;
    cursor: default;
}
</style>
<script src="sorttable.js"></script>
<script type="text/javascript">
count = 0;

var exrow = new Array("European_union.members United_States","Canada France United_Kingdom","Africa.countries");
var excol = new Array("gdp oil_consumption oil_exports","Population Area Internet_Users","debt_external hiv_aids_deaths");

function loadexample(form)
{
	document.getElementById('qr').value=document.getElementById('exr').innerHTML;
	document.getElementById('qc').value=document.getElementById('exc').innerHTML;
	if(count < exrow.length)
	{
		document.getElementById('exr').innerHTML=exrow[count];
		document.getElementById('exc').innerHTML=excol[count];
		count++;
	}
}

function load()
{
	qr = document.getElementById('qr').value;
	qc = document.getElementById('qc').value;

	for (i=0;i<excol.length;i=i+1) 
	{
		if( qr == exrow[i])
		{
			d = i+1;
			if ( d < excol.length)
			{
				count = d;
			}
			break;
		}
	}
	
	document.getElementById('exr').innerHTML=exrow[count];
	document.getElementById('exc').innerHTML=excol[count];
	count++;
}
</script>
</head>
<body onload="load()">
    <div align="left">
      <p><span class="style1"><span class="style9">.</span>Daatum<span class="style9">.</span><span class="style5">alpha</span><span class="style9">. </span></span><span class="style11">tabular data </span></p>
</div>
    <center>
      <table cellpadding="0" cellspacing="0">
    <tbody>
    <tr valign="top">
      <td align="center" nowrap="">
        <form name="f" method="post" action="/">
        <input  class="styleQueryBox" name="query_rows" value="{{ query_rows }}" type="text" id="qr" tabindex="0" size="50" />
      </td>
	  <td>&nbsp;<td>
      <td>
      <input  class="styleQueryBox" name="query_cols" value="{{ query_cols }}" type="text" id="qc" tabindex="0" size="50" />  
      </td>
    <tr>
      <td align="right">Rows example: <a style="text-decoration:none; color:#0000CC;" id="exr" href="" onClick="loadexample();return false;"></a></td>
	  <td>&nbsp;<td>
	  <td align="right">Columns example: <a style="text-decoration:none; color:#0000CC;" id="exc" href="" onClick="loadexample();return false;"></a></td>
    </tr>
    </tr></tbody></table>
    <table cellpadding="0" cellspacing="0">
    <tbody>
    <tr valign="top">
    <td align="center">
	<br/>
	<input class="KristenBlue" type="submit" value="Query" />
	</form>
      <!--<p class="KristenBlue"><a onClick="document['f'].submit()" style="font-family:inherit; font-weight:bold;" onmouseover="this.style.color='#FF6633'"  onmouseout="this.style.color='#0000CC' ">Query</a></p>-->
    </td>
    </tr></tbody></table>
<br/>
    {% if error %}
    <p style="color: rgb(255, 102, 102);"><font size="4">{{ error }}</font></p>
    {% endif %}
</center>

{% if headers %}
<table style="border-top: 0px dotted #00FF00; background:#FF none repeat scroll 0%;" width="100%" cellspacing="0" cellpadding="0" border="0"><tbody>
  <tr>
    <td nowrap="" align="left">
      <span id="sd" ><font size="4">Results</font></span>
    </td>
    <td nowrap="" align="right">
    {% if all_not_exist %}
      <span id="" align="right" style="color: rgb(255, 102, 102);"><font size="3" >One or more of the results do not yet exist. Feel free to create them!</font></span>
      {% endif %}
    </td>    
  </tr>
</tbody></table>
<table width="100%" align="center" id="results_table" class="sortable">
  <thead>
	<tr>
		<th align="left"><font size="4">entity</font></th>
		{% for header in headers %}
		<th align="left"><font size="4">{{ header }}</font></th>
		<!--<th>{{ header }}</th>-->
		{% endfor %}
	</tr>
  </thead>
  <tbody>
	{% for result in results %}
	<tr>
	    <td><a href="wiki/{{result.name}}" target="_blank"><font size="4">{{ result.name }}</font></a></td>
		<!--<td>{{ result.name }}</td>-->
	    {% for value in result.values %}
	    <td><font size="4">{{ value }}</font></td>
		<!--<td>{{ value }}</td>-->
	    {% endfor %}
	</tr>
	{% endfor %}
  </tbody>
</table>
{% endif %}

<center>
	<br/>
	<a href="/about" style="font-size:90%; text-decoration:none; font-family:'Kristen ITC';">about</a>&nbsp;-&nbsp;<a href="/feedback" style="font-size:90%; text-decoration:none; font-family:'Kristen ITC'; color: #00FF00">feedback</a>
</center>

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-4405632-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>
</body>
</html>